const { defineConfig } = require('@vue/cli-service')
const path = require('path')
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')

module.exports = defineConfig({
  transpileDependencies: true,
  
  // 静态资源路径
  publicPath: process.env.NODE_ENV === 'production' ? '/' : '/',
  
  // 构建输出目录
  outputDir: 'dist',
  
  // 静态资源目录
  assetsDir: 'static',
  
  // 开发服务器配置
  devServer: {
    port: 8080,
    open: true,
    proxy: {
      '/api': {
        target: 'http://localhost:5855',
        ws: true,
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''  // 移除前缀，防止出现重复的api路径
        },
        logLevel: 'debug' // 添加调试日志
      },
      '/upload': {
        target: 'http://localhost:5855',
        ws: false,
        changeOrigin: true,
        logLevel: 'debug' // 添加调试日志
      }
    }
  },
  
  // 生产环境是否生成 sourceMap 文件
  productionSourceMap: false,
  
  // CSS 配置
  css: {
    loaderOptions: {
      sass: {
        additionalData: `
          @use "@/assets/scss/variables.scss" as *;
          @use "@/assets/scss/mixins.scss" as *;
        `
      }
    }
  },
  
  // webpack 配置
  configureWebpack: {
    // 设置别名
    resolve: {
      alias: {
        '@': path.resolve(__dirname, 'src')
      }
    },
    plugins: [
      // 自动导入 Element Plus 组件
      AutoImport({
        resolvers: [ElementPlusResolver()],
        imports: ['vue', 'vue-router', 'vuex'],
        dts: 'src/auto-imports.d.ts',
      }),
      Components({
        resolvers: [ElementPlusResolver()],
        dts: 'src/components.d.ts',
      }),
    ],
    // 优化配置
    optimization: {
      splitChunks: {
        chunks: 'all',
        cacheGroups: {
          // 第三方库拆分
          vendor: {
            name: 'chunk-vendors',
            test: /[\\/]node_modules[\\/]/,
            priority: 10,
            chunks: 'initial'
          },
          // element-plus 单独拆包
          elementPlus: {
            name: 'chunk-element-plus',
            test: /[\\/]node_modules[\\/]element-plus[\\/]/,
            priority: 20
          },
          // 剩余公共模块
          commons: {
            name: 'chunk-commons',
            minChunks: 2,
            priority: 5,
            reuseExistingChunk: true
          }
        }
      }
    }
  },
  
  // 链式 webpack 配置
  chainWebpack: config => {
    // 移除预加载
    config.plugins.delete('preload')
    config.plugins.delete('prefetch')
    
    // svg 处理
    config.module
      .rule('svg')
      .exclude.add(path.resolve(__dirname, 'src/icons'))
      .end()
    
    // 添加页面标题
    config.plugin('html').tap(args => {
      args[0].title = 'Vue论坛系统'
      return args
    })
    
    // 生产环境优化
    if (process.env.NODE_ENV === 'production') {
      // gzip 压缩
      config.plugin('CompressionWebpackPlugin').use(
        require('compression-webpack-plugin'),
        [{
          filename: '[path][base].gz',
          algorithm: 'gzip',
          test: /\.js$|\.css$|\.html$/,
          threshold: 10240,
          minRatio: 0.8
        }]
      )
    }
  }
}) 